<template>
    <el-dialog :title="title" :visible.sync="visible" width="760px" append-to-body :close-on-click-modal="false">

        <BaseForm2 ref="form" label-position="right" label-width="86px" :fields="fields" :text-model="textModel" :data="form" size="medium" @updateValue="updateEvent"></BaseForm2>
        <div slot="footer" class="dialog-footer">
            <BaseButton :loading="submitLoading" @click="submitForm">保 存</BaseButton>
            <BaseButton type="recond" @click="cancel">取 消</BaseButton>
        </div>
    </el-dialog>
</template>

<script>
import BaseForm2 from '@/components/BaseForm2'
import { MeasurePriceModel } from '@/models'
import { 
    MaintenanceType2Options, 
    MaintenanceCategoryOptions, 
    MaintenanceCategoryOptions1,
    MaintenanceCategoryOptions2,
    MaintenanceMeasureOptions, 
    MaintenanceMeasureOptions1,
    MaintenanceMeasureOptions2,
    MaintenanceMeasureOptions3,
    MaintenanceMeasureOptions4,
    MaintenanceMeasureOptions5,
    MaintenanceMeasureOptions6,
    MaintenanceMeasureOptions7,
    MaintenanceMeasureOptions8,
    MaintenanceMeasure2Options, 
    MaintenanceType3Options,
    MaintenanceType3Options1,
    MaintenanceType3Options2 
} from '@/views/auxiliary-decision/constants'
import { isNumberOrDecimals, isNumber2, isNumber6 } from '@/utils/validate'

// 必填且数字或者小数
const validIsNumberOrDecimals = (rule, value, callback) => {
    if (value === '' || value === null || value === undefined) {
        callback()
    } else if (!isNumberOrDecimals(value)) {
        callback(new Error('格式错误'))
    } else {
        callback()
    }
}
const validIsNumber2 = (rule, value, callback) => {
    if (value === '' || value === null || value === undefined) {
        callback()
    } else if (!isNumber2(value)) {
        callback(new Error('格式错误'))
    } else {
        callback()
    }
}
const validIsNumber6 = (rule, value, callback) => {
    if (value === '' || value === null || value === undefined) {
        callback()
    } else if (!isNumber6(value)) {
        callback(new Error('格式错误'))
    } else {
        callback()
    }
}

export default {
    name: 'PriceSaveOrUpdate',
    components: {
        BaseForm2,
    },
    data() {
        return {
            pavementType: '',
            model: new MeasurePriceModel(),
            title: '新增养护方案措施及单价',
            visible: false,
            submitLoading: false,
            // 表单参数
            form: {},
            id: '',
            schemeId: '',
            textModel: false,
            fields: [
                {
                    label: '',
                    children: [
                        {
                            options: MaintenanceType2Options,
                            key: 'maintType',
                            valueKey: 'label',
                            label: '养护类型',
                            type: 'normal-select',
                            span: 24,
                            placeholder: '请选择',
                            rules: [{ required: true, message: '必填项', trigger: ['change'] }]
                        },
                        {
                            options: MaintenanceCategoryOptions,
                            key: 'maintCategory',
                            valueKey: 'label',
                            label: '养护类别',
                            type: 'normal-select',
                            span: 24,
                            placeholder: '请选择',
                            hiddenDefault: true,
                            rules: [{ required: true, message: '必填项', trigger: ['change'] }]
                        },
                        {
                            options: MaintenanceMeasureOptions,
                            key: 'measure1',
                            valueKey: 'label',
                            label: '养护措施',
                            type: 'normal-select',
                            span: 24,
                            placeholder: '请选择',
                            hiddenDefault: true,
                            rules: [{ required: true, message: '必填项', trigger: ['change'] }]
                        },
                        {
                            key: 'measure2',
                            type: 'textarea',
                            label: '养护措施',
                            maxlength: '300',
                            'show-word-limit': true,
                            span: 24,
                            rules: [{ required: true, message: '必填项', trigger: ['change'] }]
                        },
                        {
                            key: 'unitPrice',
                            type: 'input',
                            label: '单价',
                            append: '元',
                            span: 24,
                            placeholder: '请输入数字',
                            maxlength: '10',
                            rules: [
                                { required: true, message: '必填项', trigger: ['blur'] },
                                { validator: validIsNumber2, trigger: ['blur']}
                            ]
                        },
                        {
                            key: 'constructionInstallationCost',
                            type: 'input',
                            label: '公里建安费',
                            append: '万元',
                            span: 24,
                            placeholder: '请输入数字',
                            maxlength: '15',
                            rules: [{ validator: validIsNumber6, trigger: ['blur'] }]
                        },
                        {
                            key: 'kilometreCost',
                            type: 'input',
                            label: '公里造价',
                            append: '万元',
                            placeholder: '请输入数字',
                            maxlength: '15',
                            span: 24,
                            rules: [{ validator: validIsNumber6, trigger: ['blur'] }]
                        }
                    ]
                }
            ]
        }
    },
    methods: {
        updateEvent(data) {
            console.log('abc', data, this.pavementType)
            if (data.maintType) {
                const formRef = this.$refs.form
                this.$refs.form.updateFormData({ maintCategory: '', measure1: '', measure2: '' })
                switch (data.maintType) {
                    case '日常养护':
                        formRef.setElementHidden('maintCategory', true)
                        formRef.setElementHidden('measure1', true)
                        formRef.setElementHidden('measure2', false)
                        break
                    case '预防养护':
                        if (this.pavementType === '沥青路面') {
                            this.$set(this.fields[0].children[1], 'options', MaintenanceCategoryOptions1)
                        } else {
                            this.$set(this.fields[0].children[1], 'options', MaintenanceCategoryOptions2)
                        }
                        // this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions)
                        formRef.setElementHidden('maintCategory', false)
                        formRef.setElementHidden('measure1', true)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '修复养护':
                        if (this.pavementType === '沥青路面') {
                            this.$set(this.fields[0].children[1], 'options', MaintenanceType3Options1)
                        } else {
                            this.$set(this.fields[0].children[1], 'options', MaintenanceType3Options2)
                        }
                        // this.$set(this.fields[0].children[2], 'options', MaintenanceMeasure2Options)
                        formRef.setElementHidden('maintCategory', false)
                        formRef.setElementHidden('measure1', true)
                        formRef.setElementHidden('measure2', true)
                        break
                }
            }
            if (data.maintCategory) {
                const formRef = this.$refs.form
                this.$refs.form.updateFormData({ measure1: '', measure2: '' })
                switch (data.maintCategory) {
                    case '封层类':
                        this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions1)
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '罩面类':
                        if (this.pavementType === '沥青路面') {
                            this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions2)
                        } else {
                            this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions3)
                        }
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '功能性修复':
                        this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions5)
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '结构性修复':
                        this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions6)
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '注浆类':
                        this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions4)
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '局部结构性损坏':
                        this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions7)
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                    case '整体结构性损坏':
                        this.$set(this.fields[0].children[2], 'options', MaintenanceMeasureOptions8)
                        formRef.setElementHidden('measure1', false)
                        formRef.setElementHidden('measure2', true)
                        break
                }
            }
        },
        // 取消按钮
        cancel() {
            this.reset()
            this.visible = false
        },
        open(options = {}) {
            const { type, item = {}, schemeId, pavementType } = options
            this.schemeId = schemeId
            this.pavementType = pavementType
            this.id = item.id || null
            this.visible = true
            this.$nextTick(() => {
                this.reset()
                if (type === 'add') {
                    this.title = '新增养护方案措施及单价'
                    this.$refs.form.setElementHidden('maintCategory', true)
                    this.$refs.form.setElementHidden('measure1', true)
                } else {
                    this.title = '修改养护方案措施及单价'
                    switch (item.maintType) {
                        case '日常养护':
                            item.measure2 = item.maintMeasure
                            break
                        case '预防养护':
                            item.measure1 = item.maintMeasure
                            break
                        case '修复养护':
                            item.measure1 = item.maintMeasure
                            break
                    }
                    this.form = {...item}
                }
            })
            console.log(item, this.pavementType)
        },
        reset() {
            this.form = {
                id: '',
                unitPrice: '',
                maintType: '',
                maintCategory: '',
                maintMeasure: '',
                constructionInstallationCost: '',
                kilometreCost: '',
                measure1: '',
                measure2: ''
            }
            this.$refs['form'].resetFields()
        },
        submitForm() {
            this.$refs['form'].validate((valid, res) => {
                if (valid) {
                    console.log(res)
                    this.submitLoading = true
                    this.id && (res.id = this.id)
                    const data = {
                        ...res,
                        maintMeasure: res.measure1 || res.measure2,
                        maintSchemeId: this.schemeId
                    }
                    this.model
                        .saveOrUpdate(data)
                        .then(() => {
                            this.$message({
                                type: 'success',
                                message: '操作成功！',
                                duration: 500,
                                onClose: () => {
                                    this.visible = false
                                    this.$emit('success')
                                }
                            })
                        })
                        .finally(() => {
                            this.submitLoading = false
                        })
                } else {
                    this.$message.error('校验失败！')
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.w-300 {
    width: 300px;
}
</style>
